<template>
	<!-- 主体信息 -->
	<view>
		<view class="">
			<view class="main_title">
				<text>主体类别</text>
				<text>{{subject}}</text>
			</view>
			<view class="main_title">
				<text>是否存在</text>
				<u-switch v-model="showvalue" size="28"></u-switch>
			</view>
			<!-- 表单 -->
			<view class="mainNumber" v-if="showvalue">
				<view class="archives-form-item">
					<view>主体数量</view>
				</view>
				<u-form-item v-for="(item, index) in subData" :key="item.id" borderBottom>
					<!-- {{item.disabled}} -->
					<u-checkbox-group placement="column" >
						<u-checkbox :label="item.name"  :checked="item.disabled" :name="item.name"
							@change="changeBox(item,index)" >
						</u-checkbox>
					</u-checkbox-group>
					<view class="num_list">
						<text class="num_text">数量：</text>
						<u-input placeholder="请输入数量" v-model="subData[index].mun" type="number"></u-input>
					</view>
					<!-- <template>
					    <view>
					           <u-checkbox-group
					               
					               placement="column"
					               @change="checkboxChange"
					           >
					               <u-checkbox
								   checked
					                   @checked="isCheckedBox(item)"
					                  :label="item.name" 
					               >
					               </u-checkbox>
					           </u-checkbox-group>
					       </view>
					</template> -->
				</u-form-item>
			</view>
		</view>
	</view>
	</view>
</template>

<script>
	import {
		jsonParIfy
	} from "@/static/js/uilt/index.js"
	
	export default {
		name: "mineForm1",
		props: {
			subDatas: {
				type: Array,
				default: () => []
			},
			showValue: {
				type: Boolean,
				default: false
			},
			subject: {
				type: String,
				default: ''
			},
			// typeBody: {
			// 	type: Number,
			// 	// default:0
			// }
		},
		data() {
			return {
				 
				trues:true,
				showvalue: this.showValue,
				sortarr: [],//新数组
				subData: [],//父组件给的
				sum: 0
			};
		},
		watch: {
			subDatas: {
				handler(newName, oldName) {
					newName = newName.map(r=>{
						if(r.mun!==0)return r
						r.mun = 0
						return r
					})
					this.subData =jsonParIfy(newName) 
					console.log(newName);
				},
				immediate: true,
				deep: true
			},
			// subData:{
			// 	// immediate: true,
			// 	deep: true,
			// 	handler(naeName){
			// 		// console.log(naeName);
			// 	}
			// }
		},
		
		methods: {
			
			test(data){
				// this.sortarr = data
				
			},
			affirm() {
				let sum = 0
				let nums = jsonParIfy(this.sortarr)
				nums.forEach(e => {
					if (e.disabled) {
						sum += parseInt(e.mun)
					}
				})
				this.sum = sum
				return [nums, sum]
			},
			// isCheckedBox(item) {
			// 	return 
			// 	// const index = this.personList.findIndex(item2 => item2.iid == item.id);
			// 	// return index != -1;
			// },
			//点击选择类别
			changeBox(item, i) {
				item.disabled = !item.disabled
				if (item.disabled) {
					this.sortarr.push(item)
				} else {
					this.sortarr.splice(i, 1)
				}
			},
		}
	}
</script>

<style lang="scss">
	.main_title {
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1px solid #EEEEEE;
		height: 85rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #333333;
	}

	.archives-form-item {
		display: flex;
		align-items: center;
		padding: 21rpx 0;
		border-bottom: 1rpx solid #f5f2f8;

	}

	.num_list {
		display: flex;
		align-items: center;
	}

	.num_text {
		margin-left: 250rpx;
	}
</style>